<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=0, width=device-width"/>
	<title>我的晒单</title>
	<link rel="stylesheet" type="text/css" href="../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../css/common.css" />
	<link rel="stylesheet" type="text/css" href="../css/userCore.css" />
</head>
<style type="text/css">
	#userdetail{
		
box-sizing:border-box;

-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
		width: 100%;
		overflow: hidden;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
    display: -moz-box; /* Firefox 17- */
    display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
    display: -moz-flex; /* Firefox 18+ */
    display: -ms-flexbox; /* IE 10 */
    display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-flex-direction: row;
    flex-direction: row;
    display: flex;
    display: -webkit-flex;
    flex-flow: row;
     -webkit-box-align: center;   
     -moz-box-align: center;   
     -ms-flex-align: center;   
  -webkit-align-items: center;   
          align-items: center;   
  -webkit-box-pack: center;   
     -moz-box-pack: center;   
     -ms-flex-pack: center;   
    
		background-color: #FF0000;
		padding: 20px;
	
	}
	#userImg img{

		border-radius: 40px;
	}
	#userTxt{
		 -webkit-box-flex: 1; 
    -webkit-flex: 1;
    flex: 1;
		box-sizing:border-box;
		width: 100%;
		
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		display: block;
		margin-left: 20px;
		color: #fff;
	}
	#userTxt span{

		box-sizing:border-box;
		overflow: hidden;
		width: 100%;
		-webkit-box-sizing:border-box;
	}
	#userName{
		display: block;
		font-size: 18px;
		margin-bottom: 5px;
	}
	#u-nav ul{
-webkit-box-align: center;   
     -moz-box-align: center;   
     -ms-flex-align: center;   
  -webkit-align-items: center;   
          align-items: center;   
  -webkit-box-pack: center;   
     -moz-box-pack: center;   
     -ms-flex-pack: center;   
   
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
    display: -moz-box; /* Firefox 17- */
    display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
    display: -moz-flex; /* Firefox 18+ */
    display: -ms-flexbox; /* IE 10 */
    display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
    height: 34px;
    background-color: #fff;
    border-bottom: 1px solid #f3f3f3;
	}
	#u-nav ul li{
		text-align: center;
		width: 50%;
		padding: 8px 1px;

		
	}
	#u-nav ul li.active{
		color: #FF0000;
		border-bottom: 2px solid #FF0000;
		margin-top:1px;
		
	}
	
</style>
<body>
<script id="user-template" type="text/x-dot-template">
			<div id="userdetail">
			<div id="userImg">
			 {{if(isImg(it.img)){}}
         <img src="http://wap.jqmao.cn/statics/uploads/{{=it.img}}_160160.jpg" width='60px' height='60px'>
         {{}else if(isPng(it.img)){}}
         <img src="http://wap.jqmao.cn/statics/uploads/{{=it.img}}_160160.png" width='60px' height='60px'>
         {{}else{}}
         <img src="{{=it.img}}" width='60px' height='60px'>
         {{}}}
				
			</div>
			<div id="userTxt">
				<span id="userName">{{=it.username}}</span>
				
				<span id="userIp">{{=it.user_ip}}</span>
			</div>
		</div>
		</script>

	<div id="myredPacket">
		<div id='header'>
			<header >
				<div class='header classify'>
					<i id='back' onclick="back()"></i><h1>我的晒单</h1><a onclick="home('index')" class='home'></a>
				</div>
			</header>
	
	
		
			<nav id='u-nav'>
				<ul id='u-ul'>
					<li class="finished active" data-name='buy' onclick="_openFrame(0)">已晒单</li>
					<li class='unfinished' data-name='win' onclick="_openFrame(1)">未晒单</li>							
				</ul>
			</nav>
		</div>
		
	</div>
	
	
</body>
	<script type="text/javascript" src="../script/zepto.min.js"></script>
	<script type="text/javascript" src="../script/api.js"></script>
	<script type="text/javascript" src="../script/doT.min.js"></script>
	<script type="text/javascript" src="../script/common.js"></script>
	<script>
		//toggle GOODS NAV
function showNav(type) {
    if (!type) {
        return;
    }
    var nav = $api.dom('#u-nav .active');

    $api.removeCls(nav, 'active');
    var thisNav = $api.dom('#u-nav .' + type);
    $api.addCls(thisNav, 'active');
}
function openFrameGroup(frames) {
     var width = api.winWidth;
    var header = $api.byId('header');
    
    var headerPos = $api.offset(header);
    var height = api.winHeight - headerPos.h;
        api.openFrameGroup({
            name: 'group',
            scrollEnabled: true,
           rect: {
                    x: 0,
                    y: headerPos.h,
                    w: width,
                    h: height
                },
            index: 0,
            preload:0,
            frames: frames
        }, function (ret, err) {
           var type = ret['name'];
           showNav(type);                
        });
    }
    
	apiready = function(){
	headerstatus()
	api.addEventListener({
    	name: 'reload'
	}, function(ret, err){
	    if(ret.value.key){
	    _openFrame(1)
	    	_openFrame(0)
	    }
	});
	    var uid = api.pageParam.id;
	  
	    var aa = [{
	        name: 'finished', 
	        url: 'finished.html',
	        bgColor: '#f2f2f2',
	        pageParam: {uid:uid},
	        bounces:true,
	        customRefreshHeader: 'UIPullRefresh',
	        reload:true
	    },{
	        name: 'unfinished', 
	        url: 'unfinished.html', 
	        bgColor: '#f2f2f2',
	        pageParam:{uid:uid},
	        bounces:true,
	        customRefreshHeader: 'UIPullRefresh',
	        reload:true
	    }]
	    
	
	    openFrameGroup(aa)
	
	}
	</script>
	
</html>